<script lang="ts" setup>
	import DetailTitle from './Title.vue';

	interface IProps {
		intro: string;
	}

	defineOptions({
		name: 'DetailIntro',
	});

	const props = withDefaults(defineProps<Partial<IProps>>(), {
		intro: '-'
	});

</script>

<template>
	<div class="intro-bd">
		<detail-title
      icon="icon-intro"
      title="详细介绍"
		/>
		<div class="intro-content">
			{{ props.intro }}
		</div>
	</div>
</template>

<style lang="scss" scoped>
	@import '../../../../assets/styles/mixins.scss';

	.intro-bd {
		@include flex-column;
		margin-top: .1rem;
		background-color: #fff;
		border-bottom: 1px solid #ddd;
		box-sizing: border-box;

		.intro-content {
			padding: .1rem .15rem;
			font-size: .14rem;
			line-height: .18rem;
			box-sizing: border-box;
			text-indent: 2em;
		}
	}
</style>